<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ include file="../session.jsp"%>
<!DOCTYPE html>
<html lang="ko">
  <head>
  	<%@ include file="../head.jsp"%>
  	<style>
  		.table > tbody > tr > td {
  			vertical-align:middle;
  		}
  	</style>
  	<script src="resources/js/jquery.js"></script>
	<script src="resources/js/bootstrap.min.js"></script>
	<!-- 형식검사 클래스 참조 -->
	<script src="resources/js/string.js"></script>
	<script>
		$(function() {
			
			if ("${toggle}" == 'hidden') {
				$("#searchdiv").hide();
			}
			
			$("#opensearch").click(function() {
				$("#searchdiv").toggle();
				return false;
			});
		});
	</script>
  </head>
  <body>
  	<%@ include file="../menu.jsp"%>
	<div class="container">
		<div class="page-header clearfix">
			<h2 class="pull-left">리그관리 > ${sportName}</h2>
			<div class="pull-right" style="padding-top: 30px">
				<a href="#" id="opensearch" class="btn btn-info">리그등록 펼치기/접기</a>
			</div>
		</div>
		
		<div id="searchdiv">
			<div class="clearfix">
				<div class="table-responsive">
					<form id="addLeague" class="form-horizontal" role="form" method="post" action="addLeagueOk">
					
						<input type="hidden" name="idSport" value="${idSport}" />
					
						<table class="table table-bordered">
							<thead>
								<tr class="success">
									<th class="text-center col-md-2">종목</th>
									<th class="text-center col-md-4">리그명</th>
									<th class="text-center col-md-2">정렬순서</th>
									<th class="text-center col-md-2">전시여부</th>
									<th class="text-center col-md-2">추가</th>
								</tr>
							</thead>
							<tbody>
								<tr class="text-center">
									<td class="col-md-2"><p class="form-control-static">${sportName}</p></td>
									<td class="col-md-4"><input type="text" class="form-control" name="addLeagueName" /></td>
									<td class="col-md-2"><input type="number" class="form-control" name="addSortKey" /></td>
									<td class="col-md-2">
										<label class="radio-inline"><input type="radio" name="addIsDisplay" value="1" /> Y</label>
										<label class="radio-inline"><input type="radio" name="addIsDisplay" value="0" /> N</label>
									</td>
									<td class="col-md-2"><button type="submit" class="btn btn-primary">등록</button></td>
								</tr>
							</tbody>
						</table>
					</form>
				</div>
				<hr/>
			</div>
		</div>
		
		<span class="pull-left" style="margin-bottom:10px;">등록 : ${page.totalArticleCount}건 / 활성 : ${displayCount}건 / 비활성 : ${unDisplayCount}건</span>
		<div class="table-responsive">
			<table class="table table-striped table-hover">
				<thead>
					<tr class="warning row">
						<th class="text-center col-md-1">번호</th>
						<th class="text-center col-md-1">종목</th>
						<th class="text-center col-md-4">리그명</th>
						<th class="text-center col-md-1">소속팀</th>
						<th class="text-center col-md-1">게임</th>
						<th class="text-center col-md-1">정렬순서</th>
						<th class="text-center col-md-2">전시여부</th>
						<th class="text-center col-md-1">수정</th>
					</tr>
				</thead>
				<tbody>
					<c:forEach items="${list}" var="item">
						<form id="editLeague${item.idLeague}" method="post" action="editLeagueOk">
							<input type="hidden" name="editIdLeague" value="${item.idLeague}" form="editLeague${item.idLeague}" />
							<input type="hidden" name="editIdSport" value="${item.idSport}" form="editLeague${item.idLeague}" />
							<input type="hidden" name="page" value="${page.nowPage}" form="editLeague${item.idLeague}" />
							<tr class="text-center row">
								<td class="col-md-1">${item.idLeague}</td>
								<td class="col-md-1">${item.idSportValue}</td>
								<td class="col-md-4">
									<input type="text" class="form-control" name="editLeagueName${item.idLeague}" value="${item.leagueName}" 
										form="editLeague${item.idLeague}" />
								</td>
								<td class="col-md-1">${item.teamCount}</td>
								<td class="col-md-1">${item.gameCount}</td>
								<td class="col-md-1">
									<input type="number" class="form-control" name="editSortKey${item.idLeague}" value="${item.sortKey}" 
										form="editLeague${item.idLeague}" />
								</td>
								<td class="col-md-2">
									<label class="radio-inline">
										<input type="radio" name="editIsDisplay${item.idLeague}" value="1" form="editLeague${item.idLeague}"
											<c:if test="${item.isDisplay == 1}">checked</c:if> /> Y
									</label>
									<label class="radio-inline">
										<input type="radio" name="editIsDisplay${item.idLeague}" value="0" form="editLeague${item.idLeague}"
											<c:if test="${item.isDisplay == 0}">checked</c:if> /> N
									</label>
								</td>
								<td class="col-md-1"><button type="submit" class="btn btn-warning" form="editLeague${item.idLeague}">수정</button></td>
							</tr>
							<script type="text/javascript">
								$("#editLeague${item.idLeague}").submit(function() {
									
									if (!$("input[name='editLeagueName${item.idLeague}']").val().isValue()) {
										alert("리그명을 입력하세요.");
										$("input[name='editLeagueName${item.idLeague}']").focus();
										return false;
									}
									
									if (!$("input[name='editSortKey${item.idLeague}']").val().isValue()) {
										alert("정렬순서를 입력하세요.");
										$("input[name='editSortKey${item.idLeague}']").focus();
										return false;
									}
									
									if (!$("input[name='editSortKey${item.idLeague}']").val().isNumber()) {
										alert("정렬순서는 숫자로만 입력이 가능합니다.");
										$("input[name='editSortKey${item.idLeague}']").focus();
										return false;
									}
									
									if (!$("input[name='editIsDisplay${item.idLeague}']").is(":checked")) {
										alert("전시여부를 선택해 주세요");
										$("input[name='editIsDisplay${item.idLeague}']").focus();
										return false;
									}
									
									if (!confirm("정말 수정하시겠습니까?")) {
										return false;
									}
								});
							</script>
						</form>
					</c:forEach>
				</tbody>
			</table>
		</div>
		
		<div class="text-center">
			<ul class="pagination">

				<!-- 이전 그룹 -->
				<c:choose>
					<c:when test="${page.startPage > page.pageGroupCount}">
						<li><a href="listLeague?page=${page.startPage-1}&id=${idSport}">&laquo;</a></li>
					</c:when>
					<c:otherwise>
						<li class="disabled"><a href="#">&laquo;</a></li>
					</c:otherwise>
				</c:choose>
				
				<!-- 페이지 번호 -->
				<c:forEach begin="${page.startPage}" end="${page.endPage}" step="1" var="now">
					<c:choose>
						<c:when test="${page.nowPage == now}">
							<li class="active"><a href="#">${now}</a></li>
						</c:when>
						<c:otherwise>
							<li><a href="listLeague?page=${now}&id=${idSport}">${now}</a></li>
						</c:otherwise>
					</c:choose>
				</c:forEach>

				<!-- 다음 그룹 -->
				<c:choose>
					<c:when test="${page.endPage < page.lastGroupFirstPage}">
						<li><a href="listLeague?page=${page.endPage+1}&id=${idSport}">&raquo;</a></li>
					</c:when>
					<c:otherwise>
						<li class="disabled"><a href="#">&raquo;</a></li>
					</c:otherwise>
				</c:choose>

			</ul>
		</div>

	</div>
	
	<script type="text/javascript">
		$(function() {
			$("#addLeague").submit(function() {
				
				if (!$("input[name='addLeagueName']").val().isValue()) {
					alert("리그명을 입력하세요.");
					$("input[name='addLeagueName']").focus();
					return false;
				}
				
				if (!$("input[name='addSortKey']").val().isValue()) {
					alert("정렬순서를 입력하세요.");
					$("input[name='addSortKey']").focus();
					return false;
				}
				
				if (!$("input[name='addSortKey']").val().isNumber()) {
					alert("정렬순서는 숫자로만 입력이 가능합니다.");
					$("input[name='addSortKey']").focus();
					return false;
				}
				
				if (!$("input[name='addIsDisplay']").is(":checked")) {
					alert("전시여부를 선택해 주세요");
					$("input[name='addIsDisplay']").focus();
					return false;
				}
				
				if (!confirm("정말 등록하시겠습니까?")) {
					return false;
				}
			});
			
		});
	</script>
  </body>
</html>